<template>
  <div class="container">
    <h1>没有插槽</h1>
    <NoSlot />
    <h1>默认插槽</h1>
    <SlotView />
    <h1>具名插槽</h1>
    <SlotnameView />
    <h1>作用域插槽</h1>
    <ScopeView />
  </div>
</template>

<script>
import NoSlot from './components/NoSlot/index.vue'
import SlotView from './components/SlotView'
import SlotnameView from './components/SlotnameView'
import ScopeView from './components/ScopeView'

export default {
  name: 'App',
  components: {
    NoSlot,
    SlotView,
    SlotnameView,
    ScopeView
  }
}
</script>

<style lang="less">
  h1 {
    text-align: center;
  }
</style>